<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>节点</title>
  <style>
  
  
  </style>
</head>
<body>
  <div id="box">
    <p>第一个段落</p>
    <p>第二个段落</p>
  </div>

  <script>
    //子节点: childNodes
    //子元素: children
    var box = document.getElementById('box');

    //NodeLists
    console.log(box.childNodes);
    
    //遍历所有节点
    for(var i = 0; i < box.childNodes.length; i++){
      var eleNode = box.childNodes[i];
      console.log(eleNode.nodeName,eleNode.nodeType,eleNode.nodeValue);
      
    }
    
    //html
    var htmlNode = document.documentElement;
    //body
    var bodyNode = document.body;
    console.log(htmlNode);
    console.log(htmlNode.childNodes);
    console.log(bodyNode);
    console.log(bodyNode.childNodes);
    //html节点拿到的不包含第一个和最后一个文本节点
    
    //我们在body里写的节点包含第一个和最后一个文本节点
    
  </script>
</body>
</html>